<template>
  <div class="header">
    <div class="header_top">
      <div class="header_top_text">
        {{ title }}
      </div>
      <div class="more" v-if="more">更多 ></div>
    </div>
    <slot name="container" />
  </div>
</template>
<script>
export default {
  name: 'slot_box',
  props: {
    title: {
      required: true,
      type: String
    },
    more: {
      type: Boolean,
      default: false
    }
  },
  data () {
    return {
      time: ''
      // 图标
    }
  }
}
</script>
<style scoped>
.header {
  /* margin-left: 42px; */
  border-radius: 1%;
  background-color: #012b54;
  /* min-height: 650px; */
  width: 870px;
}
.header_top {
  border-radius: 1%;
  height: 72px;
  border-left: 10px solid #00aeff;
  background: linear-gradient(to right, #165a9d, #04325e);
  /* background: #155798; */
  display: flex;
  justify-content: space-between;
  box-sizing: border-box;
}
.header_top_text {
  color: #fff;
  margin-left: 38px;
  line-height: 72px;
  font-size: 36px;
}
.header .more {
  margin-right: 40px;
  line-height: 72px;
  color: rgb(50, 152, 252);
}
</style>
